import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { Component, Input, ChangeDetectionStrategy, ChangeDetectorRef } from '@angular/core';
import { IconComponent } from './icon.component';

@Component({
  template: `
    <i [lv-icon]="lvIcon" [lvDisabled]="lvDisabled" [lvColorState]="lvColorState"></i>
  `,
  changeDetection: ChangeDetectionStrategy.OnPush,
})
class TestIconBasicComponent {
  @Input() lvIcon: string;
  @Input() lvDisabled: boolean;
  @Input() lvColorState: boolean;
}

describe('IconComponent', () => {
  beforeEach(waitForAsync(() => {
    TestBed.configureTestingModule({
      declarations: [IconComponent, TestIconBasicComponent],
    }).compileComponents();
  }));

  describe('render', () => {
    let component: TestIconBasicComponent;
    let fixture: ComponentFixture<TestIconBasicComponent>;
    let cdr: ChangeDetectorRef;

    beforeEach(() => {
      fixture = TestBed.createComponent(TestIconBasicComponent);
      component = fixture.componentInstance;
      cdr = fixture.debugElement.injector.get(ChangeDetectorRef);
    });

    it('with default', () => {
      component.lvIcon = 'lv-icon-filter';
      fixture.detectChanges();
      expect(fixture).toMatchSnapshot();

      component.lvDisabled = true;
      cdr.detectChanges();
      expect(fixture).toMatchSnapshot();
    });

    it('with colorState', () => {
      component.lvIcon = 'lv-icon-filter';
      component.lvColorState = true;
      fixture.detectChanges();
      expect(fixture).toMatchSnapshot();

      component.lvDisabled = true;
      cdr.detectChanges();
      expect(fixture).toMatchSnapshot();
    });
  });
});
